<template>  
    <div>
        <el-form ref="form" :model="form" :rules="rules" class="formEmbedTableRefactor mb20 mt20">
            <table>
                <caption>A/C Information</caption>
                <tr>
                    <td><div style="min-width:108px;text-align:center">Primary A/C No.</div></td> 
                    <td>
                        <el-form-item prop="primaryAcct">
                        <span>{{confirmMsg.acctNo}}</span>
                        </el-form-item>
                    </td>
                    <td><div style="min-width:64px;text-align:center">A/C Type</div></td> 
                    <td>
                        <el-form-item prop="subType">
                        <div style="min-width:60px" v-if="confirmMsg.subType == 'P'">Savings</div>
                        <div style="min-width:60px" v-if="confirmMsg.subType == 'S'">Time deposit</div>
                        </el-form-item>
                    </td>
                </tr>

                <tr v-for="(item,index) in confirmMsg.relatedAcctList">
                    <td><div style="min-width:108px;text-align:center">A/C No.</div></td> 
                    <td>
                        <el-form-item prop="relatedAcct">
                        <span>{{confirmMsg.relatedAcctList[index].acctNo.value}}</span>
                        </el-form-item>
                    </td>
                    <td><div style="min-width:64px;text-align:center">A/C Type</div></td> 
                    <td>
                        <el-form-item prop="subType">
                        <div style="min-width:60px" v-if="confirmMsg.relatedAcctList[index].subType.value == 'P'">Savings</div>
                        <div style="min-width:60px" v-if="confirmMsg.relatedAcctList[index].subType.value == 'S'">Time deposit</div>
                        </el-form-item>
                    </td>
                </tr>
            </table>
        </el-form>

        <el-form ref="form" :model="form" class="formEmbedTable mb20">
            <table>
                <caption>CUS Information</caption>
                <tr>
                    <td>CUS.ID</td>
                    <td>
                        <span class="cOrange">{{confirmMsg.cusID}}</span>
                    </td>
                </tr>   
                <!--<tr v-for="legal in confirmMsg.cstInfo.legalList">
                    <td>CNTY</td>
                    <td>
                        <span class="cOrange">{{legal.cnty}}</span>
                    </td>
                    <td>Document Type</td>
                    <td>
                        <span class="cOrange">{{legal.docType}}</span>
                    </td>
                    <td>Document Number</td>
                    <td>
                        <span class="cOrange">{{legal.docNo}}</span>
                    </td>
                </tr>-->
            </table>
        </el-form>

        <el-form ref="form" :model="form" class="formEmbedTable mb20">
            <table>
                <tr>
                    <td>A/C Address</td>
                    <td>
                        <span class="cOrange">{{confirmMsg.acc_addr1}} {{confirmMsg.acc_addr2}} {{confirmMsg.acc_addr3}} {{confirmMsg.acc_addr4}}</span>
                    </td>
                </tr>
                <tr>
                    <td>ADDR.COUNTRY</td>
                    <td>
                        <span class="cOrange">{{confirmMsg.addr_cntry_code}}</span>
                    </td>
                </tr>
                <tr>
                    <td>Authorized Person</td>
                    <td>
                        <el-form-item>
                        <span class="cOrange">{{confirmMsg.authorPerson}}</span>
                        </el-form-item>
                    </td>
                </tr>
            </table>
        </el-form>
        <div class="btnArea mt20 tac">
            <el-button type="primary" @click="back()">Back</el-button>
        </div>
    </div>

</template>

<script>
	export default {
		name:'newPhoneAccount_detail',
        props:['toDetailData'],
		components:{
		},
		data(){
            return { 
               confirmMsg:{}
            }   
        },
		methods:{ 
            back(){
                this.$emit('back')
            },
		},
        mounted(){
            let _this = this
            _this.confirmMsg = _this.toDetailData
        }
	}
</script>